<template>
  <div class="p-2">
    <transition :enter-active-class="proxy?.animate.searchAnimate.enter"
                :leave-active-class="proxy?.animate.searchAnimate.leave">
      <div v-show="showSearch" class="search">
        <el-form ref="queryFormRef" :inline="true" :model="queryParams" label-width="68px">
          <el-form-item label="电梯名称" prop="elevatorName">
            <el-input v-model="queryParams.elevatorName" clearable placeholder="请输入电梯名称" style="width: 240px"
                      @keyup.enter="handleQuery"/>
          </el-form-item>
          <el-form-item>
            <el-button icon="Search" type="primary" @click="handleQuery">搜索</el-button>
            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
          </el-form-item>
        </el-form>
      </div>
    </transition>

    <el-card shadow="never">
      <template #header>
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button v-hasPermi="['iot:elevator:add']" icon="Plus" plain type="primary" @click="handleAdd">新增
            </el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button v-hasPermi="['iot:elevator:edit']" :disabled="single" icon="Edit" plain type="success"
                       @click="handleUpdate()"
            >修改
            </el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button v-hasPermi="['iot:elevator:remove']" :disabled="multiple" icon="Delete" plain type="danger"
                       @click="handleDelete()"
            >删除
            </el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button v-hasPermi="['iot:elevator:export']" icon="Download" plain type="warning" @click="handleExport">
              导出
            </el-button>
          </el-col>
          <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>
      </template>

      <el-table v-loading="loading" :data="elevatorList" @selection-change="handleSelectionChange">
        <el-table-column align="center" type="selection" width="55"/>
        <el-table-column align="center" label="小区名称" prop="communityName"/>
        <el-table-column align="center" label="电梯名称" prop="elevatorName">
          <template #default="scope">
            <router-link :to="'/iot/elevator/elevator-detail/' + scope.row.elevatorId" class="link-type">
              <span>{{ scope.row.elevatorName }}</span>
            </router-link>
          </template>
        </el-table-column>
        <el-table-column align="center" label="注册码" prop="registeredCode"/>
        <el-table-column align="center" label="电梯品牌" prop="elevatorBrand">
          <template #default="scope">
            <dict-tag :options="iot_elevator_brand" :value="scope.row.elevatorBrand"/>
          </template>
        </el-table-column>
        <el-table-column align="center" label="状态" prop="status">
          <template #default="scope">
            <dict-tag :options="iot_device_status" :value="scope.row.status"/>
          </template>
        </el-table-column>
        <el-table-column align="center" label="备注" prop="remark"/>
        <el-table-column align="center" class-name="small-padding fixed-width" label="操作">
          <template #default="scope">
            <el-tooltip content="修改" placement="top">
              <el-button v-hasPermi="['iot:elevator:edit']" icon="Edit" link type="primary"
                         @click="handleUpdate(scope.row)"></el-button>
            </el-tooltip>
            <el-tooltip content="删除" placement="top">
              <el-button v-hasPermi="['iot:elevator:remove']" icon="Delete" link type="primary"
                         @click="handleDelete(scope.row)"></el-button>
            </el-tooltip>
            <el-tooltip content="分配资源" placement="top">
              <el-button icon="Compass" link type="primary" @click="assignOssHandle(scope.row)"></el-button>
            </el-tooltip>
            <el-tooltip content="刷新电梯界面" placement="top">
              <el-button icon="Refresh" link type="primary" @click="handleRefresh(scope.row)"></el-button>
            </el-tooltip>
            <el-tooltip content="查看电梯画面" placement="top">
              <el-button icon="VideoCamera" link type="primary" @click="viewCamera(scope.row)"></el-button>
            </el-tooltip>
            <!--            <el-tooltip content="开启模型检测" placement="top">-->
            <!--              <el-button icon="TurnOff" link type="primary" @click="handleModelDetectionEnabled(scope.row)"></el-button>-->
            <!--            </el-tooltip>-->
          </template>
        </el-table-column>
      </el-table>

      <pagination v-show="total>0" v-model:limit="queryParams.pageSize" v-model:page="queryParams.pageNum"
                  :total="total" @pagination="getList"/>
    </el-card>
    <!-- 添加或修改电梯管理对话框 -->
    <el-dialog v-model="dialog.visible" :title="dialog.title" append-to-body width="800px">
      <el-form ref="elevatorFormRef" :model="form" :rules="rules" label-width="150px">
        <el-form-item label="小区名称" prop="communityId">
          <el-select v-model="form.communityId" filterable placeholder="请选择小区" style="width: 240px"
                     @change="changeCommunityId();">
            <el-option v-for="item in communityList" :key="item.communityId" :label="item.name"
                       :value="item.communityId"/>
          </el-select>
        </el-form-item>
        <el-form-item label="楼名称" prop="floorId">
          <el-select v-model="form.floorId" filterable placeholder="请选择楼" style="width: 240px"
                     @change="changeFloorId();">
            <el-option v-for="item in floorList" :key="item.floorId" :label="item.name" :value="item.floorId"/>
          </el-select>
        </el-form-item>
        <el-form-item label="单元名称" prop="unitId">
          <el-select v-model="form.unitId" filterable placeholder="请选择单元" style="width: 240px">
            <el-option v-for="item in unitList" :key="item.unitId" :label="item.name" :value="item.unitId"/>
          </el-select>
        </el-form-item>
        <el-form-item label="电梯名称" prop="elevatorName">
          <el-input v-model="form.elevatorName" placeholder="请输入电梯名称" style="width: 240px"/>
        </el-form-item>
        <el-form-item label="摄像头名称" prop="numberCode">
          <el-select v-model="form.numberCode" filterable placeholder="请选择摄像头" style="width: 240px">
            <el-option v-for="item in deviceChannelList" :key="item.streamCode" :label="item.name"
                       :value="item.streamCode"/>
          </el-select>
        </el-form-item>
        <el-form-item label="注册码" prop="registeredCode">
          <el-input v-model="form.registeredCode" placeholder="请输入注册码" style="width: 240px"/>
        </el-form-item>
        <el-form-item label="识别码" prop="identifyCode">
          <el-input v-model="form.identifyCode" placeholder="请输入识别码" style="width: 240px"/>
        </el-form-item>
        <el-form-item label="电梯品牌" prop="elevatorBrand">
          <el-select v-model="form.elevatorBrand" placeholder="请选择电梯品牌" style="width: 190px">
            <el-option v-for="dict in iot_elevator_brand" :key="dict.value" :label="dict.label"
                       :value="dict.value"></el-option>
          </el-select>
        </el-form-item>
        <!--        <el-form-item label="层数" prop="layerNum">-->
        <!--          <el-input v-model="form.layerNum" placeholder="请输入层数" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="站数" prop="standingNum">-->
        <!--          <el-input v-model="form.standingNum" placeholder="请输入站数" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <el-form-item label="安装日期" prop="installationDate">
          <el-date-picker v-model="form.installationDate" clearable placeholder="请选择安装日期" type="datetime"
                          value-format="YYYY-MM-DD HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <!--        <el-form-item label="年检日期" prop="annualDate">-->
        <!--          <el-date-picker v-model="form.annualDate" clearable placeholder="请选择年检日期" type="datetime"-->
        <!--                          value-format="YYYY-MM-DD HH:mm:ss">-->
        <!--          </el-date-picker>-->
        <!--        </el-form-item>-->
        <el-form-item label="下次年检日期" prop="nextAnnualDate">
          <el-date-picker v-model="form.nextAnnualDate" clearable placeholder="请选择下次年检日期" type="datetime"
                          value-format="YYYY-MM-DD HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <!--        <el-form-item label="使用单位" prop="useUnit">-->
        <!--          <el-input v-model="form.useUnit" placeholder="请输入使用单位" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="电梯管理员" prop="elevatorAdministrator">-->
        <!--          <el-input v-model="form.elevatorAdministrator" placeholder="请输入电梯管理员" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="维保单位" prop="maintenanceUnit">-->
        <!--          <el-input v-model="form.maintenanceUnit" placeholder="请输入维保单位" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="维保工程师" prop="maintenanceEngineer">-->
        <!--          <el-input v-model="form.maintenanceEngineer" placeholder="请输入维保工程师" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="入网日期" prop="networkDate">-->
        <!--          <el-date-picker v-model="form.networkDate" clearable placeholder="请选择入网日期" type="datetime" value-format="YYYY-MM-DD HH:mm:ss">-->
        <!--          </el-date-picker>-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="检修(0:开;1:关)" prop="checkFix">-->
        <!--          <el-input v-model="form.checkFix" placeholder="请输入检修(0:开;1:关)" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="经度" prop="longitude">-->
        <!--          <el-input v-model="form.longitude" placeholder="请输入经度" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="纬度" prop="latitude">-->
        <!--          <el-input v-model="form.latitude" placeholder="请输入纬度" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="使用地点" prop="usePlace">-->
        <!--          <el-input v-model="form.usePlace" placeholder="请输入使用地点" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="厂商" prop="vendor">-->
        <!--          <el-input v-model="form.vendor" placeholder="请输入厂商" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <el-form-item label="生产日期" prop="productionDate">
          <el-date-picker v-model="form.productionDate" clearable placeholder="请选择生产日期" type="datetime"
                          value-format="YYYY-MM-DD HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="额定载重(kg)" prop="ratedLoad">
          <el-input v-model="form.ratedLoad" placeholder="请输入额定载重(kg)" style="width: 240px"/>
        </el-form-item>
        <el-form-item label="型号" prop="modelNumber">
          <el-input v-model="form.modelNumber" placeholder="请输入型号" style="width: 240px"/>
        </el-form-item>
        <el-form-item label="出厂编号" prop="factoryCode">
          <el-input v-model="form.factoryCode" placeholder="请输入出厂编号" style="width: 240px"/>
        </el-form-item>
        <el-form-item label="额定速度(m/s)" prop="nominal">
          <el-input v-model="form.nominal" placeholder="请输入额定速度(m/s)" style="width: 240px"/>
        </el-form-item>
        <!--        <el-form-item label="安装单位" prop="installUnit">-->
        <!--          <el-input v-model="form.installUnit" placeholder="请输入安装单位" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="提升高度(m)" prop="promoteHeight">-->
        <!--          <el-input v-model="form.promoteHeight" placeholder="请输入提升高度(m)" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="曳引机功率(KW)" prop="tractorPower">-->
        <!--          <el-input v-model="form.tractorPower" placeholder="请输入曳引机功率(KW)" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <el-form-item label="标准楼层高度(m)" prop="standardFloorHeight">
          <el-input v-model="form.standardFloorHeight" placeholder="请输入标准楼层高度(m)" style="width: 240px"/>
        </el-form-item>
        <el-form-item label="限速器下次年检日期" prop="speedGovernor">
          <el-date-picker v-model="form.speedGovernor" placeholder="请输入限速器下次年检日期" type="datetime"
                          value-format="YYYY-MM-DD HH:mm:ss"/>
        </el-form-item>
        <!--        <el-form-item label="特种设备使用登记证编号" prop="specialEquipmentCode">-->
        <!--          <el-input v-model="form.specialEquipmentCode" placeholder="请输入特种设备使用登记证编号" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="发证日期" prop="issueDate">-->
        <!--          <el-date-picker v-model="form.issueDate" clearable placeholder="请选择发证日期" type="datetime" value-format="YYYY-MM-DD HH:mm:ss">-->
        <!--          </el-date-picker>-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="特种设备使用登记证" prop="specialEquipmentRegistration">-->
        <!--          <el-input v-model="form.specialEquipmentRegistration" placeholder="请输入特种设备使用登记证" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="电梯监督检验报告编号" prop="inspectionReportNum">-->
        <!--          <el-input v-model="form.inspectionReportNum" placeholder="请输入电梯监督检验报告编号" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="电梯监督检验报告" prop="inspectionReport">-->
        <!--          <el-input v-model="form.inspectionReport" placeholder="请输入电梯监督检验报告" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="特种设备使用标志" prop="specialEquipmentUseFlag">-->
        <!--          <el-input v-model="form.specialEquipmentUseFlag" placeholder="请输入特种设备使用标志" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="审验编号" prop="approvalNumber">-->
        <!--          <el-input v-model="form.approvalNumber" placeholder="请输入审验编号" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="审验名称" prop="approvalName">-->
        <!--          <el-input v-model="form.approvalName" placeholder="请输入审验名称" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="审验单位" prop="approvalUnit">-->
        <!--          <el-input v-model="form.approvalUnit" placeholder="请输入审验单位" style="width: 240px" />-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="	审验时间" prop="approvalDate">-->
        <!--          <el-date-picker v-model="form.approvalDate" clearable placeholder="请选择	审验时间" type="datetime" value-format="YYYY-MM-DD HH:mm:ss">-->
        <!--          </el-date-picker>-->
        <!--        </el-form-item>-->
        <!--        <el-form-item label="申请日期" prop="applicationDate">-->
        <!--          <el-date-picker v-model="form.applicationDate" clearable placeholder="请选择申请日期" type="datetime" value-format="YYYY-MM-DD HH:mm:ss">-->
        <!--          </el-date-picker>-->
        <!--        </el-form-item>-->
        <el-form-item label="井道高度" prop="shaftHeight">
          <el-input v-model="form.shaftHeight" placeholder="请输入井道高度" style="width: 240px"/>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model="form.remark" placeholder="请输入内容" style="width: 240px" type="textarea"/>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </template>
    </el-dialog>
    <el-dialog v-model="dialogFormVisible" append-to-body title="开启板端模型检测" width="500px">
      <el-form ref="modelDetectionRef" :model="modelDetection" :rules="modelRules" label-width="150px">
        <el-form-item label="摄像头rtsp地址：" prop="rtspUrl">
          <el-input v-model="modelDetection.rtspUrl" placeholder="请输入摄像头rtsp地址"/>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="cancelModelDetection">取消</el-button>
          <el-button type="primary" @click="enableModelDetection"> 确定</el-button>
        </div>
      </template>
    </el-dialog>
    <DevicePlayer ref="devicePlayerRef"/>
  </div>
</template>

<script lang="ts" name="Elevator" setup>
import DevicePlayer from '@/views/video_monitor/dialog/devicePlayer.vue'
import {
  addElevator,
  delElevator,
  getElevator,
  listElevator,
  modelDetectionEnabled,
  refreshElevator,
  updateElevator
} from "@/api/iot/elevator";
import {ElevatorForm, ElevatorQuery, ElevatorVO} from "@/api/iot/elevator/types";
import {listCommunity} from "@/api/system/community";
import {listFloor} from "@/api/system/floor";
import {listBuildingUnit} from "@/api/system/buildingUnit";
import router from "@/router";
import {listDeviceChannel, startPlay} from "@/api/video_monitor/channel";

const devicePlayerRef = ref<InstanceType<typeof DevicePlayer>>();
const {proxy} = getCurrentInstance() as ComponentInternalInstance;
const {
  iot_device_status,
  iot_elevator_brand
} = toRefs<any>(proxy?.useDict("iot_device_status", "iot_elevator_brand"));
const elevatorList = ref<ElevatorVO[]>([]);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const communityList = ref<Array<any>>([]);
const floorList = ref<Array<any>>([]);
const unitList = ref<Array<any>>([]);
const deviceChannelList = ref<Array<any>>([]);

const queryFormRef = ref<ElFormInstance>();
const elevatorFormRef = ref<ElFormInstance>();
const modelDetectionRef = ref<ElFormInstance>();
const dialogFormVisible = ref<boolean>(false);
const dialog = reactive<DialogOption>({
  visible: false,
  title: ""
});
const modelDetection: any = reactive<any>({
  rtspUrl: undefined,
  registeredCode: undefined
});
const modelRules: any = reactive<any>({
  rtspUrl: [
    {required: true, message: "摄像头rtsp地址不能为空", trigger: "blur"}
  ],
  registeredCode: [
    {required: true, message: "电梯注册码不能为空", trigger: "blur"}
  ]
});
const initFormData: ElevatorForm = {
  elevatorId: undefined,
  communityId: undefined,
  elevatorName: undefined,
  numberCode: undefined,
  registeredCode: undefined,
  identifyCode: undefined,
  elevatorBrand: undefined,
  layerNum: undefined,
  standingNum: undefined,
  installationDate: undefined,
  annualDate: undefined,
  nextAnnualDate: undefined,
  useUnit: undefined,
  elevatorAdministrator: undefined,
  maintenanceUnit: undefined,
  maintenanceEngineer: undefined,
  networkStatus: undefined,
  networkDate: undefined,
  elevatorStatus: undefined,
  checkFix: undefined,
  unitId: undefined,
  floorId: undefined,
  longitude: undefined,
  latitude: undefined,
  usePlace: undefined,
  buildType: undefined,
  elevatorType: undefined,
  straightElevatorType: undefined,
  escalatorType: undefined,
  vendor: undefined,
  productionDate: undefined,
  useType: undefined,
  ratedLoad: undefined,
  bumperType: undefined,
  modelNumber: undefined,
  factoryCode: undefined,
  nominal: undefined,
  installUnit: undefined,
  promoteHeight: undefined,
  tractorPower: undefined,
  standardFloorHeight: undefined,
  speedGovernor: undefined,
  specialEquipmentCode: undefined,
  issueDate: undefined,
  specialEquipmentRegistration: undefined,
  inspectionReportNum: undefined,
  inspectionReport: undefined,
  specialEquipmentUseFlag: undefined,
  approvalNumber: undefined,
  approvalName: undefined,
  approvalType: undefined,
  approvalUnit: undefined,
  approvalDate: undefined,
  applicationDate: undefined,
  auditStatus: undefined,
  isFault: undefined,
  shaftHeight: undefined,
  curLayer: undefined,
  status: undefined,
  remark: undefined
};
const data = reactive<PageData<ElevatorForm, ElevatorQuery>>({
  form: {...initFormData},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    communityId: undefined,
    elevatorName: undefined,
    numberCode: undefined,
    registeredCode: undefined,
    identifyCode: undefined,
    elevatorBrand: undefined,
    layerNum: undefined,
    standingNum: undefined,
    installationDate: undefined,
    annualDate: undefined,
    nextAnnualDate: undefined,
    useUnit: undefined,
    elevatorAdministrator: undefined,
    maintenanceUnit: undefined,
    maintenanceEngineer: undefined,
    networkStatus: undefined,
    networkDate: undefined,
    elevatorStatus: undefined,
    checkFix: undefined,
    unitId: undefined,
    floorId: undefined,
    longitude: undefined,
    latitude: undefined,
    usePlace: undefined,
    buildType: undefined,
    elevatorType: undefined,
    straightElevatorType: undefined,
    escalatorType: undefined,
    vendor: undefined,
    productionDate: undefined,
    useType: undefined,
    ratedLoad: undefined,
    bumperType: undefined,
    modelNumber: undefined,
    factoryCode: undefined,
    nominal: undefined,
    installUnit: undefined,
    promoteHeight: undefined,
    tractorPower: undefined,
    standardFloorHeight: undefined,
    speedGovernor: undefined,
    specialEquipmentCode: undefined,
    issueDate: undefined,
    specialEquipmentRegistration: undefined,
    inspectionReportNum: undefined,
    inspectionReport: undefined,
    specialEquipmentUseFlag: undefined,
    approvalNumber: undefined,
    approvalName: undefined,
    approvalType: undefined,
    approvalUnit: undefined,
    approvalDate: undefined,
    applicationDate: undefined,
    auditStatus: undefined,
    isFault: undefined,
    shaftHeight: undefined,
    curLayer: undefined,
    status: undefined,
    params: {}
  },
  rules: {
    elevatorId: [
      {required: true, message: "电梯不能为空", trigger: "blur"}
    ],
    communityId: [
      {required: true, message: "小区ID不能为空", trigger: "blur"}
    ],
    elevatorName: [
      {required: true, message: "电梯名称不能为空", trigger: "blur"}
    ],
    numberCode: [
      {required: true, message: "编码不能为空", trigger: "blur"}
    ],
    registeredCode: [
      {required: true, message: "注册码不能为空", trigger: "blur"}
    ],
    identifyCode: [
      {required: true, message: "识别码不能为空", trigger: "blur"}
    ],
    elevatorBrand: [
      {required: true, message: "电梯品牌不能为空", trigger: "blur"}
    ],
    installationDate: [
      {required: true, message: "安装日期不能为空", trigger: "blur"}
    ],
    nextAnnualDate: [
      {required: true, message: "下次年检日期不能为空", trigger: "blur"}
    ],
    unitId: [
      {required: true, message: "单元ID不能为空", trigger: "blur"}
    ],
    floorId: [
      {required: true, message: "楼ID不能为空", trigger: "blur"}
    ],
    productionDate: [
      {required: true, message: "生产日期不能为空", trigger: "blur"}
    ],
    ratedLoad: [
      {required: true, message: "额定载重(kg)不能为空", trigger: "blur"}
    ]
  }
});


const {queryParams, form, rules} = toRefs(data);

/** 查询电梯管理列表 */
const getList = async () => {
  loading.value = true;
  const res = await listElevator(queryParams.value);
  elevatorList.value = res.rows;
  total.value = res.total;
  loading.value = false;
};

/** 取消按钮 */
const cancel = () => {
  reset();
  dialog.visible = false;
};

/** 表单重置 */
const reset = () => {
  form.value = {...initFormData};
  elevatorFormRef.value?.resetFields();
};

/** 搜索按钮操作 */
const handleQuery = () => {
  queryParams.value.pageNum = 1;
  getList();
};

/** 重置按钮操作 */
const resetQuery = () => {
  queryFormRef.value?.resetFields();
  handleQuery();
};

/** 多选框选中数据 */
const handleSelectionChange = (selection: ElevatorVO[]) => {
  ids.value = selection.map(item => item.elevatorId);
  single.value = selection.length != 1;
  multiple.value = !selection.length;
};

/** 新增按钮操作 */
const handleAdd = () => {
  reset();
  dialog.visible = true;
  dialog.title = "添加电梯管理";
};

/** 修改按钮操作 */
const handleUpdate = async (row?: ElevatorVO) => {
  reset();
  const _elevatorId = row?.elevatorId || ids.value[0];
  const res = await getElevator(_elevatorId);
  Object.assign(form.value, res.data);
  dialog.visible = true;
  dialog.title = "修改电梯管理";
};
/** 刷新按钮操作 */
const handleRefresh = async (row?: ElevatorVO) => {
  const _elevatorId = row?.elevatorId || ids.value[0];
  await refreshElevator(_elevatorId);
  proxy?.$modal.msgSuccess("刷新成功");
};
/** 查看电梯画面操作 */
const viewCamera = async (row?: ElevatorVO) => {
  let numberCode = row?.numberCode;
  if (numberCode == undefined) {
    proxy?.$modal.msgError("电梯无监控");
    return;
  }
  loading.value = true;
  let strings = numberCode.split("_");
  const deviceId = strings[0];
  const channelId = strings[1];
  const res = await startPlay(deviceId, channelId);
  console.log("devicePlayerRef", devicePlayerRef);
  devicePlayerRef.value?.openDialog("media", deviceId, channelId, {
    streamInfo: res.data,
    hasAudio: true,
  });
  loading.value = false;
};
/**开启板端检测*/
const handleModelDetectionEnabled = (row?: ElevatorVO) => {
  modelDetectionRef.value?.resetFields();
  modelDetection.registeredCode = undefined;
  modelDetection.registeredCode = row?.registeredCode;
  dialogFormVisible.value = true;
};
const cancelModelDetection = () => {
  modelDetectionRef.value?.resetFields();
  modelDetection.registeredCode = undefined;
  modelDetection.rtspUrl = undefined;
  dialogFormVisible.value = false;
};
const enableModelDetection = async () => {
  modelDetectionRef.value?.validate(async (valid: boolean) => {
    if (valid) {
      await modelDetectionEnabled(modelDetection);
      dialogFormVisible.value = false;
      proxy?.$modal.msgSuccess("开启成功");
    }
  });
};
/** 提交按钮 */
const submitForm = () => {
  elevatorFormRef.value?.validate(async (valid: boolean) => {
    if (valid) {
      buttonLoading.value = true;
      if (form.value.elevatorId) {
        await updateElevator(form.value).finally(() => buttonLoading.value = false);
      } else {
        await addElevator(form.value).finally(() => buttonLoading.value = false);
      }
      proxy?.$modal.msgSuccess("修改成功");
      dialog.visible = false;
      await getList();
    }
  });
};

/** 删除按钮操作 */
const handleDelete = async (row?: ElevatorVO) => {
  const _elevatorIds = row?.elevatorId || ids.value;
  await proxy?.$modal.confirm("是否确认删除电梯管理编号为\"" + _elevatorIds + "\"的数据项？").finally(() => loading.value = false);
  await delElevator(_elevatorIds);
  proxy?.$modal.msgSuccess("删除成功");
  await getList();
};

/** 导出按钮操作 */
const handleExport = () => {
  proxy?.download("iot/elevator/export", {
    ...queryParams.value
  }, `elevator_${new Date().getTime()}.xlsx`);
};

onMounted(() => {
  getList();
});
watch(() => dialog.visible, async (v) => {
  if (v) {
    let communityRes = await listCommunity();
    communityList.value = communityRes.rows;
  }
}, {immediate: true});
watch(() => form.value.communityId, async (v) => {
  if (v) {
    let floorRes = await listFloor({"communityId": v});
    floorList.value = floorRes.rows;
    let deviceChannelResponse = await listDeviceChannel({"communityId": v});
    deviceChannelList.value = deviceChannelResponse.rows;
  }
});
watch(() => form.value.floorId, async (v) => {
  if (v) {
    let unitRes = await listBuildingUnit({"floorId": v});
    unitList.value = unitRes.rows;
  }
});
/** 分配资源*/
const assignOssHandle = (row: ElevatorVO) => {
  router.push("/iot/oss-assign/elevator/" + row.elevatorId);
};

const changeCommunityId = () => {
  form.value.floorId = undefined;
  form.value.unitId = undefined;
};
const changeFloorId = () => {
  form.value.unitId = undefined;
};
</script>
